import { Component } from "react";
import './Bottom.css'

export default class Bottom extends Component {
    constructor (props) {
        super(props)
    }
    allChangeCks(e) {
        this.props.allChangeCks(e.target.checked)
    }
    choseDel() {
        this.props.choseDel()
    }
    render(){
        const { list, allCheck } = this.props
        const doneList = list.filter(item => item.check)
        return (<div className="bottom">
            <span>已完成 { doneList.length } / { list.length }</span>
            <div>
                <input type='checkbox' checked={ allCheck } onChange={ this.allChangeCks.bind(this) } />
                全选
            </div>
            <button onClick={ this.choseDel.bind(this) }>选中删除</button>
        </div>)
    }
}